<!DOCTYPE html>
<!--HTML5 doctype-->
<html>

<head>

  <title>安居快递系统</title>
  <meta http-equiv="Content-type" content="text/html; charset=utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, minimal-ui">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta http-equiv="Pragma" content="no-cache">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">

  <link rel="stylesheet" type="text/css" href="css/jsmo/af.ui.css" />
  <link rel="stylesheet" type="text/css" href="css/jsmo/icons.css" />
  <link rel="stylesheet" type="text/css" href="css/index.css" />
  <link rel="stylesheet" type="text/css" href="css/dropdownlist.css" />

  <script type="text/javascript" charset="utf-8" src="js/jsmo/jquery-2.1.4.js"></script>
  <script type="text/javascript" charset="utf-8" src="js/jsmo/fastclick.js"></script>
  <script type="text/javascript" charset="utf-8" src="js/jsmo/appframework.ui.js"></script>
  <script type="text/javascript" charset="utf-8" src="js/contants.js"></script>
  <script type="text/javascript" charset="utf-8" src="js/index.js"></script>
  <script type="text/javascript" charset="utf-8" src="js/dropdownlist.js"></script>


  <script type="text/javascript">
    $.afui.useOSThemes=false;
    $.afui.loadDefaultHash=true;
    $.afui.autoLaunch=false;

    //check search
    var search=document.location.search.toLowerCase().replace("?","");
    if(search.length>0)
    {

       $.afui.useOSThemes=true;
        if(search=="win8")
            $.os.ie=true;
        else if(search=="firefox")
            $.os.fennec="true"
        $.afui.ready(function(){
            $(document.body).get(0).className=(search);
        });
    }


    $(document).ready(function(){
      setTimeout(function(){
        $.afui.launch();
      },1000);

      setTimeout(function(){

      /**判断是否已经登录，若已经登录，则登录界面更改为显示账户和网店信息*/
        if (window.localStorage){
          var username=localStorage.getItem("usename");
          if(username){
            $("#labUsername").html(username.toString());
            $("#labStation").html(username.toString());
            $("#labTel").html(username.toString());
            $(".menuButton").attr("data-left-menu","leftMenuLg");

          }
        }
      },1090)

    });


    //if($.os.ios)
        $.afui.animateHeader(true);

    </script>
</head>
<body>

  <div id="splashscreen" class="ui-loader heavy">
    <br/>
    <br/>
    安居快递系统
    <br/>
    <br/>
    <span class="ui-icon ui-icon-loading spin"></span>
    <h1>安居快递</h1>
  </div>

  <div class="view" id="mainview">
      <header>
          <a class="menuButton" data-left-menu="leftMenuLogin" data-transition="fade"></a>
          <h1>安居快递</h1>
      </header>

      <div class="pages">

         <!--Tab View Pages-->
        <div class="panel" id="main" data-title="收件扫描" data-select="true">
          <br/>
          <table>
            <tr>
              <td width="85px" style="vertical-align:middle;padding-bottom:10px">扫描单号*</td>
              <td ><input style="font-size:25px;height:70px" id="orderNo" type="text" placeholder="快递单号"></td>
              <td><a style="margin-left:20px;height:35px;widt:25px" class="button" >扫描</a></td>
            </tr>
            <tr>
              <td width="85px" style="vertical-align:middle;padding-bottom:10px">目的站点*</td>
              <td >
                <select id="orStation" placeholder="目的站点">
                  <option value="volvo">安海</option>
                  <option value="saab">石狮</option>
                  <option value="fiat">石井</option>
                  <option value="volvo">安海</option>
                  <option value="volvo">安海</option>
                  <option value="saab">石狮</option>
                  <option value="fiat">石井</option>
                  <option value="volvo">安海</option>
                  <option value="volvo">安海</option>
                  <option value="saab">石狮</option>
                  <option value="fiat">石井</option>
                  <option value="volvo">安海</option>
                  <option value="volvo">安海</option>
                  <option value="volvo">安海</option>
                  <option value="saab">石狮</option>
                  <option value="fiat">石井</option>
                  <option value="volvo">安海</option>
                  <option value="volvo">安海</option>
                  <option value="volvo">安海</option>
                  <option value="saab">石狮</option>
                  <option value="fiat">石井</option>
                  <option value="volvo">安海</option>
                </select>
              </td>
            </tr>
            <tr>
              <td width="85px" style="vertical-align:middle;padding-bottom:10px">重量(公斤)*</td>
              <td style="vertical-align:middle"><input id="orWeight" type="text" placeholder="重量(公斤)"></td>
            </tr>
            <tr>
              <td width="85px" style="vertical-align:middle;padding-bottom:10px">体积(方)</td>
              <td ><input id="orVolume" type="text" placeholder="体积(方)"></td>
            </tr>
            <tr>
              <td width="85px" style="vertical-align:middle;padding-bottom:10px">总运费(元)*</td>
              <td ><input id="orCost" type="text" placeholder="总运费(元)"></td>
            </tr>
          </table>
          <br/>
          <a class='button'style="width:100%" >保存</a>
        </div>

        <div class="panel" data-title="派件扫描" id="foobar">
          <br/>
          <table>
            <tr>
              <td width="85px" style="vertical-align:middle;padding-bottom:10px">扫描单号*</td>
              <td><input style="font-size:25px;height:70px" id="pdNo" type="text" placeholder="快递单号"></td>
              <td><a style="margin-left:20px;height:35px;widt:25px" class="button" >扫描</a></td>
            </tr>
            <tr>
              <td width="85px" style="vertical-align:middle;padding-bottom:10px">签收人*</td>
              <td><input id="pdreceiver" type="text" placeholder="重量(公斤)"></td>
            </tr>
            <tr>
              <td width="85px" style="vertical-align:middle;padding-bottom:10px">签收时间*</td>
              <td><input id="pdtime" type="text" placeholder="重量(公斤)"></td>
            </tr>
            <tr>
              <td width="85px" style="vertical-align:middle;padding-bottom:10px">签收状态*</td>
              <td>
                <select id="pdstatus">
                  <option value="volvo">签收</option>
                  <option value="saab">退回</option>
                </select>
              </td>
            </tr>
            <tr>
              <td width="85px" style="vertical-align:middle;padding-bottom:10px">派件网点</td>
              <td><input id="pdStation" type="text"></td>
            </tr>
          </table>
          <br/>
          <a class='button'style="width:100%" >保存</a>
        </div>

        <div class="panel" data-title="快递查询" id="about">
            This is view for third Tab
        </div>

      </div>

      <footer>
          <a href="#main" class="icon home" id="tab1">收件扫描</a>
          <a href="#foobar" class="icon heart" id="tab2">寄件扫描</a>
          <a href="#about" class="icon html5" id="tab3">快递查询</a>
      </footer>

      <nav id="leftMenuLogin" style="width:90%">
        <div class="view active" id="navView1">
          <header><h1>系统登录</h1></header>
          <div class="pages">
            <div class="panel active" id="login">
              <br/>
              <br/>
              <br/>
              <div class="card">
                  <!--<h1>Login</h1>-->
                  <br/>
                  <div class="input-group">
                    <input id="lgusernae" type="text" placeholder="账户名">
                    <input id="username" type="hidden" >
                    <input id="lgpw" type="text" placeholder="密码">
                  </div>
                  <br/>
                  <a data-menu-close class='button' href='#main'>取消</a>
                  <a class='button' href='#main' onclick="$.afui.drawer.hide('#leftMenuLogin')">登录</a>
              </div>
            </div>
          </div>
        </div>
      </nav>

      <nav id="leftMenuLg" style="width:90%">
        <div class="view active" id="navView2">
          <header><h1>用户信息</h1></header>
          <div class="pages">
            <div class="panel active" id="login">
              <br/>
              <br/>
              <br/>
              <div class="card">
                  <!--<h1>Login</h1>-->
                <div>
                  <table>
                    <tr style="margin:10px;">
                      <td width="25%">
                        账户名
                      </td>
                      <td>
                        <p id="labUsername"></p>
                      </td>
                    </tr>
                    <tr style="margin:10px;">
                      <td width="25%">
                        所在网点
                      </td>
                      <td>
                        <p id="labStation"></p>
                      </td>
                    </tr>
                    <tr style="margin:10px;">
                      <td width="25%">
                        联系电话
                      </td>
                      <td>
                        <p id="labTel"></p>
                      </td>
                    </tr>
                  </table>
                </div>
                <br/>
                <a class='button' href='#main' onclick="$.afui.drawer.hide('#leftMenuLg')">退出登录</a>
              </div>
            </div>
          </div>
        </div>
      </nav>
  </div>
</body>
</html>
<script>
// 通过原生select控件创建自定义下拉框
    var ddl_picture = DropDownList.create({
        select:$('#orStation'),
        attrs:{
            column :6,
        }
    });
</script>
</script>
